import React, { FC,useState} from 'react';
import { Text, View,Button,Image,updateAI2AgentVariableAgentVariable,getLaunchOptionsSync } from '@ray-js/ray';
import styles from './index.module.less';
import warning from '../../assets/images/tab/warning.png';
import { Input } from '@ray-js/ray';

export default function Rename_popup(props){ 
  const close=()=>{
    props.onClose();
  }

  //重命名球球
  const RenameBallName=(e)=>{
    if(e.detail.value==='')   //至少一个字符
    {
      return;
    }
    const { query: { deviceId } } = getLaunchOptionsSync();
    updateAI2AgentVariableAgentVariable({  
      devId: deviceId,  
      variableMap: {  
        "custom.ballName":e.detail.value,
      }  
    });
  }

  //重命名对主人的称呼
  const RenameHostName=(e)=>{
    if(e.detail.value==='')   //至少一个字符
    {
      return;
    }
    const { query: { deviceId } } = getLaunchOptionsSync();
    updateAI2AgentVariableAgentVariable({  
      devId: deviceId,  
      variableMap: {  
        "custom.call":e.detail.value,
      }  
    });
  }
    return (
        <>
          <View className={styles.container2}>
            <View className={styles.close} onClick={close}>
              <Text className={`iconfont icon-close close_icon`}></Text>
            </View>
            {/* <Text className={styles.text1}>你称呼TA:</Text>
            <Input className={styles.input1} placeholder={props.currentBallName} maxLength={5} onBlur={RenameBallName} onConfirm={RenameBallName}></Input> */}
            <View className={styles.RenameContainer}>
              <Text className={styles.text2}>让球球这样称呼你</Text>
              <Input className={styles.input2} placeholder={`_${props.currentHostName}_____`} maxLength={10} onBlur={RenameHostName} onConfirm={RenameHostName}></Input>
            </View>
            
          </View>


        </>
      );
}
